<!DOCTYPE html>
<html lang="en">

<head>
    <title>未关闭事项管理</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-store, must-revalidate">
    <meta http-equiv="expires" content="Wed, 26 Feb 1997 08:21:57 GMT">
    <meta http-equiv="expires" content="-1">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" href="/dist/img/icon.png" type="image/x-icon">
    <!-- Bootstrap 3.3.6 -->
    <link rel="stylesheet" href="/dist/plugins/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/dist/plugins/select2/select2.min.css">
    <link rel="stylesheet" href="/dist/css/font-awesome.min.css">
    <link rel="stylesheet" href="/dist/css/ionicons.min.css">
    <link rel="stylesheet" href="/dist/css/OA.min.css?t=86e2297f">
    <link rel="stylesheet" href="/dist/css/skins/OA-skins.min.css?t=222aea35">
</head>

<body>
    <section class="content" id="app">
        <div>
            <div style="height: 25px;margin-bottom: 10px;">
                <input type="text" placeholder="关键字" id="txtParent" class="form-control pull-left input-sm" style="width: 200px;"
                    v-model="keyWord">
                <button type="button" class="btn oaBtn btn-sm pull-left" style="margin-left: 10px;" @click="search">
                    查询
                </button>
                <input type="button" value="添加未关闭事项" class="btn oaBtn btn-sm pull-right" @click="showDialog('add',0)">
            </div>

            <div class="box-body no-padding box-border" style="overflow: auto;background: #fff;">
                <div class="box-body no-padding iframeH4" style="overflow: auto;" id="scrollDiv">
                    <table class="table table-hover table-s">
                        <thead>
                            <tr>
                                <th style="width: 400px;">标题</th>
                                <th>发起人</th>
                                <th>负责人</th>
                                <th>参与人</th>
                                <th>抄送人</th>
                                <th>发起日期</th>
                                <th>预计结束日期</th>
                                <th style="width: 120px;">操作</th>
                            </tr>
                        </thead>
                        <tbody id="tbList">
                            <template v-for="item,i in list" :key="index">
                                <tr class="list1">
                                    <td>{{item.TRACK_TITLE}}</td>
                                    <td>{{item.USER_NAME}}</td>
                                    <td>{{item.PRINCIPAL_NAME}}</td>
                                    <td>{{item.cyrName}}</td>
                                    <td>{{item.csrName}}</td>
                                    <td>{{item.CREATE_TIME}}</td>
                                    <td>{{item.PREDICT_TIME}}</td>
                                    <td>
                                        <a href="#" @click="closeMatter(item)" v-if="currentUser.id==item.USER_ID || currentUser.id==item.PRINCIPAL">关闭</a>
                                        <a class="more-track" @click="moreTrack(i,item)" v-if="item.btnOp==0 && item.trackList != null && item.trackList.length>1">更多跟踪</a>
                                        <a class="more-track" @click="closeTrack(i,item)" v-if="item.btnOp==1">关闭跟踪</a>
                                    </td>
                                </tr>
                                <tr style="border-bottom:1px solid #eee">
                                    <td colspan="7"><span style="color:#ccc">详情：</span>{{item.TRACK_CONTENT}}</td>
                                    <td>
                                        <a href="#" @click="showDialog('edit',item)" v-if="currentUser.id==item.USER_ID || currentUser.id==item.PRINCIPAL">编辑</a>
                                        <a href="#" @click="addTrack(item)">添加跟踪</a>
                                    </td>
                                </tr>

                                <tr v-for="trackItem,ti in item.trackList" :key="trackItem.index" v-if="ti>0 ? item.btnOp==1 : true">
                                    <td colspan="7">
                                        <div class="p-line"><span style="color:#ccc">{{trackItem.USER_NAME}}
                                                {{trackItem.CREATE_TIME}}：</span>{{trackItem.TRACK_CONTENT}}</div>
                                        <template v-for="replayItem,ri in trackItem.replayList" :key="replayItem.index">
                                            <div class="p-line" style="margin-left: 25px;" v-if="trackItem.btnReply==1"><span
                                                    style="color:#ccc">{{replayItem.USER_NAME}}回复
                                                    {{replayItem.CREATE_TIME}}：</span>{{replayItem.REPLY_CONTENT}}</div>
                                        </template>
                                    </td>
                                    <td style="width: 150px;padding-left: 4px;">
                                        <a href="#" @click="addReply(trackItem)">回复</a>
                                        <a href="#" @click="moreReply(trackItem)" v-if="trackItem.REPLAY_COUNT>0 && trackItem.btnReply==0">展开回复({{trackItem.REPLAY_COUNT}})</a>
                                        <a href="#" @click="closeReply(trackItem)" v-if="trackItem.REPLAY_COUNT>0 && trackItem.btnReply==1">收起回复({{trackItem.REPLAY_COUNT}})</a>
                                    </td>
                                </tr>
                            </template>
                        </tbody>
                    </table>
                </div>
            </div>

        </div>

        <div class="oa-pager text-center" style="margin-top: 5px;">
            共<span id="allCount">{{recordCount}}</span>条记录&nbsp;&nbsp;&nbsp;
            <span id="nowPage">{{pageIndex}}</span>/<span id="allPage">{{pageCount}}</span>&nbsp;&nbsp;&nbsp;
            <span id="first" class="oa-pager-button" @click="pagination('first')">首页</span>
            <span id="prev" class="oa-pager-button" @click="pagination('pre')">上一页</span>
            <span id="next" class="oa-pager-button" @click="pagination('next')">下一页</span>
            <span id="last" class="oa-pager-button" @click="pagination('last')">尾页</span>
        </div>

    </section>
    <script src="/dist/plugins/jQuery/jquery-2.2.3.min.js"></script>
    <!--插件JS-->
    <script src="/dist/plugins/bootstrap/js/bootstrap.min.js"></script>
    <!--框架已定义 JS-->
    <script src="/dist/js/app_iframe.js?t=8e743a31"></script>
    <!--oa自定义  JS-->
    <script src="/dist/js/oa.js?t=54c6b89c"></script>
    <script type="text/javascript" src="/dist/plugins/vue/vue.js"></script>
    <script type="text/javascript" src="/dist/plugins/lhgdialog/lhgdialog.min.js?self=true"></script>
    <script type="text/javascript" src="/dist/plugins/select2/select2.full.min.js"></script>
    <style type="text/css">
        a {
            cursor: pointer
        }

        .table-s {
            border: 0px
        }

        .table-s td {
            border-top: 0 !important;
            height: 24px;
        }

        .table-s tr:hover {
            background-color: #fff !important;
        }

        .table-s .list1 td {
            /* background-color:#f8f8f8 !important; */
            border-top: 1px solid #cdcdcd !important;
        }

        .table-s .p-line {
            margin: 0px;
            line-height: 20px;
        }
    </style>
    <script type="text/javascript">
        var app = new Vue({
            el: '#app',
            data: {
                currentUser: getCurrentUser(),
                pageIndex: 1,
                pageCount: 1,
                recordCount: 1,
                list: [],
                keyWord: ""
            },
            methods: {
                refresh: function () {
                    var that = this;
                    $.wyui.postMethod(urlConfig.wreport.wreportUnfinish.getWReportUnfinishMainList, {
                        requestPage: that.pageIndex,
                        keyWord: that.keyWord,
                        userId: that.currentUser.id,
                    }, function (data) {
                        for (var i = 0; i < data.records.length; i++) {
                            data.records[i].btnOp = 0;
                        }
                        that.list = data.records;
                        that.pageIndex = data.pager.pageIndex;
                        that.pageCount = data.pager.pageCount;
                        that.recordCount = data.pager.recordCount;
                    });
                },
                search: function () {
                    this.pageIndex = 1;
                    this.refresh();
                },
                pagination: function (auction) {
                    if (auction == "first")
                        this.pageIndex = 1;
                    else if (auction == "next" && this.pageIndex < this.pageCount)
                        this.pageIndex += 1;
                    else if (auction == "pre" && this.pageIndex > 1)
                        this.pageIndex -= 1;
                    else if (auction == "last")
                        this.pageIndex = this.pageCount;
                    this.refresh();
                },
                closeMatter:function(item){
                    if(confirm("确定关闭该事项？")){
                        $.wyui.postMethod(urlConfig.wreport.wreportUnfinish.closeMatter, {
                            id: item.ID
                        }, function (data) {
                            this.refresh();
                        });
                    }
                    
                },
                addTrack:function(item){
                    var sTitle = trimRN2(item.TRACK_TITLE)==''?'添加跟踪':'添加跟踪(' + item.TRACK_TITLE + ')';
                    $.dialog({
                        content: 'url:addTrack.html?mainId=' + item.ID,
                        title: sTitle,
                        width: 700,
                        height: 250,
                        max: false,
                        min: false,
                        lock: true
                    });
                },
                addReply:function(item){
                    $.dialog({
                        content: 'url:addReply.html?trackId=' + item.ID,
                        title: '回复跟踪（'+item.USER_NAME + new Date(item.CREATE_TIME).Format("MM-dd hh:ss")+'）',
                        width: 700,
                        height: 250,
                        max: false,
                        min: false,
                        lock: true
                    });
                },
                showDialog: function (pageType, item) {
                    var condition ="";
                    if(pageType == "edit"){
                        condition += "&id="+item.ID;
                        condition += "&principal=" + item.PRINCIPAL;
                        condition += "&principalName=" + item.PRINCIPAL_NAME;
                        condition += "&csrPerson=" + (item.csr == undefined?"":item.csr);
                        condition += "&cyrPerson=" + (item.cyr == undefined?"":item.cyr);
                        condition += "&csrPersonName=" + (item.csrName == undefined?"":item.csrName);
                        condition += "&cyrPersonName=" + (item.cyrName == undefined?"":item.cyrName);
                        condition += "&trackTitle=" + item.TRACK_TITLE;
                        condition += "&trackContent=" + item.TRACK_CONTENT;
                        condition += "&predictTime=" + (item.PREDICT_TIME==""?"":new Date(item.PREDICT_TIME).Format("yyyy-MM-dd")); 
                    }
                    $.dialog({
                        content: 'url:detail.html?pageType=' + pageType + (condition == "" ? "" : condition),
                        title: '添加未关闭事项',
                        width: 700,
                        height: 300,
                        max: false,
                        min: false,
                        lock: true
                    });
                },
                moreTrack: function (i, item) {
                    var that = this;
                    item.btnOp = 1;
                },
                closeTrack: function (i, item) {
                    item.btnOp = 0;
                },
                moreReply: function (item) {
                    item.btnReply = 1;
                    if (item.replayList.length == 0) {
                        item.replayList = [];
                        $.wyui.postMethod(urlConfig.wreport.wreportUnfinish.getWReportUnfinishReply, {
                            trackId: item.ID
                        }, function (data) {
                            for (var i = 0; i < data.length; i++) {
                                var reply = new Object();
                                reply.REPLY_CONTENT = data[i].REPLY_CONTENT;
                                reply.USER_NAME = data[i].USER_NAME;
                                reply.CREATE_TIME = data[i].CREATE_TIME;
                                item.replayList.push(reply);
                            }
                        });
                    }
                },
                closeReply: function (item) {
                    item.btnReply = 0;
                }
            },
            mounted: function () {
                var that = this;
                this.refresh();
            }
        });
        function refresh(toStart) {
            if(toStart)
                app.pageIndex=1;
            app.refresh()
        }

        $.wyui.page.dataUrl = server.ip + urlConfig.wreport.wreportUnfinish.getWReportUnfinishMainList;
        $.wyui.page.queryParams.userId = $.wyui.page.urlParams.userId ? $.wyui.page.urlParams.userId : getCurrentUser().id;
        $.wyui.page.getByPage_callback = function (records) {
            console.log(records)
            app.list.main = records;
            document.getElementById("scrollDiv").scrollTop = 0;
        };
        $.wyui.page.getByPage_scroll_callback = function (list) {
            if (list.length < 30) {
                isLoad = false;
            } else {
                for (var i = 0; i < list.length; i++) {
                    app.list.push(list[i]);
                }
                isLoad = true;
            }
        };
    </script>
</body>

</html>